/**
 * 匠言知识付费v2.0.0
 * Author: 山西匠言网络科技有限公司
 * 这不是一个免费软件，它受限于许可条款，你可以访问https://www.zsfzxkc.cn/获取更多详细信息。
 * This is not a free software, it under the license terms, you can visit https://www.zsffzxkc.cn/ get more details.
 */
<template>
	<view class="container">
		<!-- 自定义底部start -->
		<jy-navbar :current_index='current_ind'></jy-navbar>
		<!-- 自定义底部end -->
		<!-- 联系我们微信二维码、电话 -->
		<view class="contact" v-if="wechatshow">
			<image :src="base_set.wechat" mode="aspectFit"></image>
			<view @click="make_phone1"><text>电话：{{base_set.phone}}</text><button type="primary" size="mini">一键拨号</button></view>
			<view @click="kefuchat" style="display: flex;align-items: center;"><button style="display: flex;align-items: center;" type="primary" size="mini"><image style="width: 50rpx;height: 50rpx;" src="../../static/kefu1.png" mode="aspectFit"></image>联系在线客服</button></view>
			<image class="closebtn" src="../../static/close.png" mode="aspectFit" @click="closewechat"></image>
		</view>
		<!-- 头部 -->
		<view class="user-title">
			<view class="page-title">
				
			</view>
			<view class="user-title-center">
				<view class="user-photo">
				<image :src="userinfo.avatar?userinfo.avatar:'../../static/user-photo.png'" mode="aspectFit" @click="navigate('person-message')"></image>
				<view class="user-info">
					<text v-if="userinfo && userinfo.nickname " @click="navigate('person-message')">{{userinfo.nickname}}</text>
					<text v-else @click="loginNow">立即登录</text>
					<text v-if="userinfo && userinfo.id ">UID:{{userinfo.id}}</text>
					<text v-if="userinfo.is_vip == 1" style="color: #FF5722;padding: 0;">{{vipinfo.levelname +'-'+ vipinfo.viptype + "  有效期:"+vipinfo.dqtime}}</text>
					<text v-if="userinfo && userinfo.phone && (userinfo.phone =='' || userinfo.phone == null || userinfo.phone == undefined)" @click="bindPhone">绑定手机号(奖励{{base_set.bindphone_zsmoney}}元)</text>
					<text v-if="userinfo && userinfo.phone && (userinfo.phone !='' || userinfo.phone != null || userinfo.phone == undefined) " style="border: none;">{{secret_phone}}</text>
					<text v-if="userinfo && userinfo.danwei =='' " style="border: 1rpx solid #fff;padding: 5rpx;" @click="navigate('person-message')">加入单位</text>
					<text v-if="userinfo && userinfo.danwei !='' && userinfo.danwei != null && userinfo.danwei != undefined " style="border: none;">单位:{{userinfo.danwei}}</text>
					<text v-if="userinfo && userinfo.banji !='' && userinfo.banji != null && userinfo.banji != undefined" style="border: none;">班级:{{userinfo.banji}}</text>
				</view>
				</view>
				<view class="cut" @click="navigate('set')">
					<image src="/static/set.png" mode="aspectFit"></image>
				</view>
			</view>
			
			
			<view class="user-title-bottom">
				<!-- 余额列表 -->
				<view class="user-balance" v-if="base_set.smallapp.is_sh==0">
					<!-- #ifdef H5 || APP-PLUS || MP-WEIXIN -->
					<view class="user-balance-item" @click="openChongzhi">
						<text>{{userinfo.money?userinfo.money:0}}</text>
						<text>余额（充值）</text>
					</view>
					<!-- #endif -->
					<view class="user-balance-item" @click="navigate('credits-exchange')">
						<text>{{userinfo.credit?userinfo.credit:0}}</text>
						<text>积分</text>
					</view>
					<view @click="navigate('learn-time')" class="user-balance-item" style="overflow: hidden;">
						<image src="../../static/jilu.png" mode="aspectFit"></image>
						<text>学习记录</text>
					</view>
					<view @click="navigate('message')" class="user-balance-item">
						<text>0</text>
						<text>消息</text>
					</view>
				</view>
			</view>
			
			<view class="chongzhi" v-if="isChongzhi === true">
				<view class="chongzhi-box">
					<view class="chongzhi-box-top">
						<text>当前余额：￥{{userinfo.money?userinfo.money:0}}</text>
						<view class="money-input">
							<text>充值金额：</text>
							<input type="digit" placeholder="请输入充值金额" @input="changeCzmoney" />
						</view>
					</view>
					<view class="chongzhi-box-bottom">
						<text @click="closeChongzhi(false)">关闭</text>
						<text @click="czbtn">充值</text>
					</view>
				</view>
			</view>
			
			
			<view class="user-icon-list" v-if="base_set.smallapp.is_sh==0">
				<view class="user-icon-list-item" @click="navigate('sign-in')">
					<image src="../../static/user-qiandao.png" mode="aspectFit"></image>
					<text>每日签到</text>
				</view>
				<view class="user-icon-list-item" @click="navigate('credits-exchange')">
					<image src="../../static/user-jifen.png" mode="aspectFit"></image>
					<text>积分商城</text>
				</view>
				<view class="user-icon-list-item" @click="navigate('wo-subscribe')">
					<image src="../../static/dingyue.png" mode="aspectFit"></image>
					<text>我的收藏</text>
				</view>
				<view class="user-icon-list-item" @click="navigate('shipping-address')">
					<image src="../../static/user-duihuan.png" mode="aspectFit"></image>
					<text>地址管理</text>
				</view>
			</view>
			
		</view>
		
		<view class="user-cut" v-if="isCut == true">
			<!-- #ifdef H5 || APP-PLUS -->
			<view class="user-cut-vip" @click="navigate('vip')">
				<image src="../../static/user-vip-cut.png" mode="aspectFit"></image>
			</view>
			<!-- #endif -->
			<view class="user-cut-box1" style="margin-top: 15rpx;">
				<view class="user-cut-box1-top">
					<text>更多服务</text>
				</view>
				<view class="user-cut-box1-bottom">
					<!-- #ifdef H5 || APP-PLUS -->
					<view class="cut-list">
						<view class="cut-list-item" @click="navigate('wo-course')">
							<image src="../../static/orders1.png" mode="aspectFit"></image>
							<text>我的订单</text>
						</view>
						<view class="cut-list-item" @click="navigate('usercourseplan')">
							<image src="../../static/kcb.png" mode="aspectFit"></image>
							<text>课程表</text>
						</view>
						<view class="cut-list-item" @click="navigate('vip')">
							<image src="../../static/sj-vip.png" mode="aspectFit"></image>
							<text>升级VIP</text>
						</view>
						<view class="cut-list-item" @click="navigate('agent')">
							<image src="../../static/dls.png" mode="aspectFit"></image>
							<text>代理中心</text>
						</view>
						<view class="cut-list-item" @click="navigate('fenxiao-center')">
							<image src="../../static/fxs.png" mode="aspectFit"></image>
							<text>分销中心</text>
						</view>
						<view class="cut-list-item" @click="navigate('jigou-center')">
							<image src="../../static/jgzx.png" mode="aspectFit"></image>
							<text>机构中心</text>
						</view>
						<view class="cut-list-item" @click="navigate('teacher-center')">
							<image src="../../static/jszx.png" mode="aspectFit"></image>
							<text>讲师中心</text>
						</view>
						<view class="cut-list-item" @click="navigate('file-upload-center')">
							<image src="../../static/Contribution.png" mode="aspectFit"></image>
							<text>投稿中心</text>
						</view>
						<view class="cut-list-item" @click="navigate('exam-center')">
							<image src="../../static/exam.png" mode="aspectFit"></image>
							<text>心理测评中心</text>
						</view>
						<view class="cut-list-item" @click="navigate('exam-center1')">
							<image src="../../static/exam.png" mode="aspectFit"></image>
							<text>考试中心</text>
						</view>
						<view class="cut-list-item" @click="navigate('doctor-center')">
							<image src="../../static/doctor.png" mode="aspectFit"></image>
							<text>问答中心</text>
						</view>
						<view class="cut-list-item" @click="make_phone">
							<image src="../../static/kefu1.png" mode="aspectFit"></image>
							<text>在线客服</text>
						</view>
						<view class="cut-list-item" @click="logout">
							<image src="../../static/logout.png" mode="aspectFit"></image>
							<text>退出登录</text>
						</view>
					</view>
					<!-- #endif -->
					<!-- #ifndef H5 || APP-PLUS -->
					<view class="cut-list" >
						<view class="cut-list-item" @click="navigate('wo-course')">
							<image src="../../static/orders1.png" mode="aspectFit"></image>
							<text>我的订单</text>
						</view>
						<view class="cut-list-item" @click="navigate('usercourseplan')">
							<image src="../../static/kcb.png" mode="aspectFit"></image>
							<text>课程表</text>
						</view>
						<view class="cut-list-item" @click="navigate('teacher-center')">
							<image src="../../static/jszx.png" mode="aspectFit"></image>
							<text>讲师中心</text>
						</view>
						<view class="cut-list-item" @click="logout">
							<image src="../../static/logout.png" mode="aspectFit"></image>
							<text>退出登录</text>
						</view>
					</view>
					<!-- #endif -->
				</view>
			</view>
			<!-- logo -->
			<view class="logo" @click="copyright">
				<image src="../../static/jishuzhichi.png" mode="aspectFit"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import {checkUserinfo,h5wx_login,mpwx_login,appwx_login,mptt_login} from '@/request/checkUserinfo'
	export default {
		data() {
			return {
				title: '个人中心',
				path:'',
				userinfo:{},
				wx_nickname:'',
				get_wxinfo:false,
				isChongzhi: false,
				czmoney:0,
				shop_phone:'',
				isCut: true,
				todayTotal:0,
				base_set:{},
				current_ind:4,
				dot_text:0,
				has_notReadMsg:true,
				wechatshow:false,
				secret_phone:'',
				vipinfo:{}
			};
		},
		onShareAppMessage(res) {
			let path = getCurrentPages()
			let path_share = path[0].$page.fullPath
			let path_title = path[0].data.title
			let userinfo = uni.getStorageSync('userinfo')
			if(userinfo.uid=='' || !userinfo.uid){
				uni.navigateTo({
					url:'../login/login'
				})
			}else{
				if (res.from === 'button') {
					
				}
				return {
					title: path_title,
					path: `${path_share}?pid=${userinfo.uid}`,
					imageUrl:'../../static/banner4.png'
				}
			}
		},
		onLoad() {
			// #ifdef MP-TOUTIAO
			this.footerList[1].page_route = '/pages/sign-in/sign-in';
			this.footerList[1].name = '签到';
			// #endif
			
		},
		onShow(){
			this.dot_text = getApp().globalData.dot_text;
			this.base_set = uni.getStorageSync('base_set')
			if(this.base_set && this.base_set != '' && this.base_set != null){
				this.shop_phone = this.base_set.phone
			}else{
				this.base_set.smallapp.is_sh = 0
			}
			// #ifdef H5
			var ua = window.navigator.userAgent.toLowerCase();
			if (ua.match(/micromessenger/i) == 'micromessenger') {
				var userinfo=uni.getStorageSync('userinfo')
				if(!userinfo && !userinfo.userdata){
					h5wx_login()
				}
			}
			// #endif
			this.base_check()
		},
		methods: {
			kefuchat(){
				uni.navigateTo({
					url:'/pages/wenda/chat/chat?item='+JSON.stringify(this.base_set.kefuinfo)+'&type=kefu'
				})
			},
			geTel(tel) {
				var reg = /^(\d{3})\d{4}(\d{4})$/;
				return tel.replace(reg, "$1****$2");
			},
			closewechat(){
				this.wechatshow=false
			},
			bindPhone(){
				uni.navigateTo({
					url: '/pages/login/login?bindphone=1',
				});
			},
			loginNow (){
				uni.navigateTo({
					url: `/pages/login/login`,
				});
			},
			copyright(){
				uni.navigateTo({
					url:'../copyright/copyright'
				})
			},
			gettodaystudytime(){
				const BASE_URL = uni.BASE_URL
				uni.request({
					url: BASE_URL+'index/user/my_today_studytime',
					method:'POST',
					data:{
						uid:this.userinfo.id
					},
					success:(res) =>{
						console.log(res.data);
						if(res.data.code==0){
							this.todayTotal=this.formatSecToStr((res.data.data.videostudytime)+(res.data.data.audiostudytime)+(res.data.data.tuwenstudytime))
						}
					},
					fail:(res)=> {
						console.log(res.data);
					}
				});
			},
			formatSecToStr(seconds){
			    let daySec = 24 *  60 * 60;
				let hourSec=  60 * 60;
				let minuteSec=60;
			    let dd = Math.floor(seconds / daySec);
			    let hh = Math.floor((seconds % daySec) / hourSec);
			    let mm = Math.floor((seconds % hourSec) / minuteSec);
				let ss=seconds%minuteSec;
			    if(dd > 0){
			      return dd + "天" + hh + "小时" + mm + "分钟"+ss+"秒";
			    }else if(hh > 0){
			      return hh + "小时" + mm + "分钟"+ss+"秒";
			    } else if (mm > 0){
			      return mm + "分钟"+ss+"秒";
			    }else{
			      return ss+"秒";
			    }
			},
			set(){
				uni.showModal({
					title: '提示',
					content: '确定要清除缓存吗?',
					success: function (res) {
						if (res.confirm) {
							uni.clearStorage();
							uni.showToast({
								title:'缓存清理成功!'
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			// 切换风格
			cutButton() {
				this.isCut = !this.isCut
			},
			make_phone(){
				this.wechatshow=true
			},
			make_phone1(){
				if(this.shop_phone!=''){
					uni.makePhoneCall({
						phoneNumber: this.shop_phone
					});
				}else{
					uni.showToast({
						title:'暂未设置客服联系方式！',
						icon:'none'
					})
				}
			},
			changeCzmoney(e){
				this.czmoney=e.detail.value
			},
			czbtn(){
				if(this.czmoney<=0){
					uni.showToast({
						title:'充值金额不能为空',
						icon:'none'
					})
					return false
				}
				uni.navigateTo({
					url:'../confirm-order-form/confirm-order-form?goodstype=chongzhi&czmoney='+this.czmoney
				})
			},
			logout(){
				uni.showModal({
					title: '提示',
					content: '确定要退出登录吗？',
					success: function (res) {
						if (res.confirm) {
							uni.removeStorageSync('userinfo')
							uni.navigateTo({
								url:'/pages/login/login'
							})
						} else if (res.cancel) {
								console.log('用户点击取消');
						}
					}
				});
			},
			base_check(){
				const userinfo_check= uni.getStorageSync('userinfo')
				if(userinfo_check.userdata){
					this.userinfo.nickname=userinfo_check.userdata.nickname
					this.userinfo.avatar=userinfo_check.userdata.avatar
					this.userinfo.id=userinfo_check.userdata.id
					this.userinfo.phone=userinfo_check.userdata.phone
					if(this.userinfo.phone !='' && this.userinfo.phone != null){
						var reg = /^(\d{3})\d{4}(\d{4})$/;
						this.secret_phone = this.userinfo.phone.replace(reg, "$1****$2");
					}
					checkUserinfo()
					setTimeout(()=>{
						var userinfo=uni.getStorageSync('userinfo')
						this.userinfo=userinfo.userdata
						if(this.userinfo.phone !='' && this.userinfo.phone != null){
							var reg = /^(\d{3})\d{4}(\d{4})$/;
							this.secret_phone = this.userinfo.phone.replace(reg, "$1****$2");
						}
						this.gettodaystudytime()
						if(this.userinfo.id!=''){
							const BASE_URL = uni.BASE_URL
							uni.request({
								url: BASE_URL+'index/vip/vipinfo',
								method:'POST',
								data:{
									uid:this.userinfo.id,
								},
								success:(res) =>{
									this.vipinfo = res.data.data;
									console.log(res.data);
								},
								fail:(res)=> {
									console.log(res.data);
								}
							});
						}
					},2000)
				}else{
					this.userinfo = {}
				}
				//新版微信小程序 用户昵称变为‘微信用户’，头像空白解决方案
				// if(this.userinfo.nickname == '微信用户'){
				// 	uni.showModal({
				// 		title: '需要修改昵称头像吗?',
				// 		content: '确认后可将微信用户昵称修改为自定义昵称头像',
				// 		success: function (res) {
				// 			if (res.confirm) {
				// 				uni.navigateTo({
				// 					url:'/pages/person-message/person-message'
				// 				})
				// 			} else if (res.cancel) {
				// 				console.log('用户点击取消');
				// 			}
				// 		}
				// 	});
				// }
			},
			navigate(e) {
				if(e=='shipping-address'){
					uni.navigateTo({
						url: `/pages/mall/${e}/${e}`
					});
				}else if(e=='jigou-center'){
					uni.showToast({
						title:'请购买商用版'
					})
					// uni.navigateTo({
					// 	url:'/pages/sub/'+e+'/'+e
					// })
				}else if(e=='teacher-center'){
					uni.navigateTo({
						url:'/pages/teacher-center/'+e+'/'+e
					})
				}
				else if(e=='exam-center'){
					uni.showToast({
						title:'请购买商用版'
					})
					// uni.navigateTo({
					// 	url:'/pages/sub/'+e+'/'+e
					// })
				}
				else if(e=='exam-center1'){
					uni.showToast({
						title:'请购买商用版'
					})
					// uni.navigateTo({
					// 	url:'/pages/sub/'+'exam-center'+'/'+e
					// })
				}
				else if(e=='agent'){
					uni.navigateTo({
						url:'/pages/fenxiao/'+e+'/'+e
					})
				}else if(e=='fenxiao-center'){
					uni.navigateTo({
						url:'/pages/fenxiao/'+e+'/'+e
					})
				}else if(e=='file-upload-center'){
					uni.showToast({
						title:'请购买商用版'
					})
					// uni.navigateTo({
					// 	url:'/pages/filedownload/'+e+'/'+e
					// })
				}else if(e == 'doctor-center'){
					uni.showToast({
						title:'请购买商用版'
					})
					// uni.navigateTo({
					// 	url:'/pages/wenda/'+e+'/'+e
					// })
				}
				else {
					uni.navigateTo({
						url: `/pages/${e}/${e}`
					});
				}
			},
			openChongzhi() {
				this.isChongzhi = true
			},
			closeChongzhi(e) {
				if(e) {
					this.isChongzhi = false
				} else {
					this.isChongzhi = false
				}
			},
			shouquan(e){
				if(e=='TOUTIAO'){
					mptt_login()
				}else if(e=='WEIXIN'){
					mpwx_login()
				}else if(e=='ALIPAY'){
					mpalipay_login()
				}else if(e=='BAIDU'){
					mpbaidu_login()
				}else if(e=='QQ'){
					mpqq_login()
				}else if(e=='360'){
					mp360_login()
				}else if(e=='APP'){
					appwx_login()
				}
			}
		}
	}
</script>

<style lang="less" scoped>
	
	.contact{
		background: rgba(9,9,9,.6);
		position: fixed;
		height: 100vh;
		width: 100%;
		top:0;
		left:0;
		z-index: 999999;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		view{
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: center;
			height: 80upx;
			margin-top: 30upx;
			text{
				color: #fff;
				margin-right: 20upx;
			}
		}
		.closebtn{
			width: 40upx;
			height: 40upx;
			margin-top: 50upx;
		}
		image{
			width: 60%;
		}
	}

	.asdasd {
		width: 150upx;
		height: 80upx;
		background-color: orange;
		position: fixed;
		right: 50upx;
		bottom: 200upx;
	}
	
.container{
	background-color: #ebeef5;
	font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
}
.wxinfo_btn{
	background-color: rgba(9,9,9,.8);
	position: fixed;
	z-index: 999;
	top:0;
	left: 0;
	width: 100%;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	&-box{
		font-size: 26upx;
		width: 60%;
		min-height: 260upx;
		padding: 30upx;
		background-color: rgba(255,255,255,.9);
		border-radius: 20upx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
		.tsinfo{
			font-size: 30upx;
			font-weight: 700;
		}
		button{
			font-size: 33upx;
			background-color: #07c160;
			color: #fff;
			border: none;
			padding: 0 100rpx;
		}
	}
}


// 充值
.chongzhi {
	width: 100%;
	height: 100vh;
	position: fixed;
	z-index: 999;
	top: 0;
	left: 0;
	background: rgba(9,9,9,.3);
	&-box {
		width: 600upx;
		// height: 420upx;
		background-color: #fff;
		border-radius: 20upx;
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -80%);
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		&-top {
			padding: 30upx 20upx 50upx;
			display: flex;
			flex-direction: column;
			text {
				font-size: 34upx;
				color: #333;
			}
			text:nth-child(2) {
				margin: 20upx 0;
			}
			.money-input {
				margin-top: 20upx;
				display: flex;
				align-items: center;
				input {
					height: 60upx;
					border: 2upx solid #ddd;
					border-radius: 10upx;
					padding-left: 10upx;
				}
			}
		}
		&-bottom {
			border-top: 2upx solid #ddd;
			display: flex;
			align-items: center;
			justify-content: space-between;
			text {
				width: 50%;
				height: 90upx;
				// background-color: #007AFF;
				color: #333;
				font-size: 34upx;
				font-weight: 700;
				display: flex;
				align-items: center;
				justify-content: center;
			}
			text:last-child {
				border-left: 1rpx solid #eee;
				color: #4b89ff;
			}
		}
	}
}




// 头部
.user-title {
	width: 100%;
	height: 480upx;
	padding-top: .5rem;
	background: url() no-repeat;
	background-size: 100%;
	    
	.page-title{
		text-align: center;
		font-size: 1.2rem;
		color: #fff;
	}
	&-center {
		margin-top: 30upx;
		width: 100%;
		height: 100upx;
		 display: flex;
		 align-items: center;
		justify-content: space-between;
		padding: 30upx 0;
		.user-photo {
			display: flex;
			justify-content: center;
			margin-left: 30rpx;
			align-items: center;
			image {
				width: 108upx;
				height: 108upx;
				border-radius: 54upx;
			}
		}
		.user-info {
			margin-left: 20upx;
			display: flex;
			justify-content: space-evenly;
			flex-direction: column;
			color: #fff;
			.jianglitext{
				font-size: 20upx;
			}
			text{
				font-size: 25upx;
			}
			text:nth-child(1) {
				font-size: 32upx;
				font-weight: 700;
				color: #fff;
			}
			text:nth-child(2) {
				width: 150upx;
				height: 32upx;
				line-height: 32upx;
				font-size: 20upx;
				// border: 2upx solid #fff;
				// border-radius: 30upx;
				color: #fff;
			}
			text:nth-child(3) {
				height: 32upx;
				line-height: 32upx;
				font-size: 20upx;
				color: #fff;
			}
			text:nth-child(4) {
				font-size: 25upx;
				border-radius: 10rpx;
				border: 1rpx solid #fff;
			}
		}
		.user-qiandao {
			color: #fff;
			padding: 0 10upx;
			height: 50upx;
			background-color: rgba(255,255,255,.38);
			border-radius: 60upx;
			text-align: center;
			line-height: 50upx;
			font-size: 30upx;
			font-weight: 700;
			margin-right: 50upx;
		}
		.wechat-login{
			border: none;
			// background-color: transparent;
			outline: none;
			margin-top: 30upx;
			display: flex;
			align-items: center;
			justify-content: center;
			image{
				width: 94upx;
				height: 94upx;
			}
		}
		.wechat-login::after{
			border: none;
			outline: none;
		}
	}
	&-bottom {
		padding: 20upx 0;
		.user-balance {
			padding: 0 10upx;
			display: flex;
			align-items: center;
			&-item {
				flex: 1;
				height: 100upx;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				border-right: 1upx solid rgba(255,255,255,.15);
				image{
					width: 100rpx;
					height:100rpx;
				}
				text{
					line-height:50upx;
				}
				text:nth-child(1) {
					font-size: 42upx;
					color: #fff;
				}
				text:nth-child(2) {
					font-size: 24upx;
					color: #fff;
				}
			}
			&-item:last-child{
				border: none;
			}
		}
	}
	
	.user-icon-list {
		width: 690upx;
		height: 200upx;
		margin: 10upx 30upx 0 30upx;
		background-color: #fff;
		border-radius: 20upx;
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		&-item {
			display: flex;
			flex-direction: column;
			align-items: center;
			image {
				width: 80upx;
				height: 80upx;
			}
			text {
				font-size: 26upx;
				margin-top: 20upx;
			}
		}
	}
	
}



// 设置清缓存
.cut {
	position: absolute;
	right:30upx;
	top:50upx;
	image{
		width: 50upx;
		height: 50upx;
	}
}
.user-box {
	width: 100%;
	margin-top: 80upx;
	background-color: #ebeef5;
	&-item {
		height: 100upx;
		background-color: #fff;
		margin-bottom: 16upx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		&-left {
			display: flex;
			align-items: center;
			image {
			width: 45upx;
			height: 45upx;
			margin: 0 30upx;
			}
			text {
				font-size: 30upx;
			}
		}
		&-right {
			width: 35upx;
			height: 35upx;
			margin-right: 30upx;
		}
	}
	
	// 退出登录
		.logout{
			height: 100upx;
			background-color: #fff;
			display: flex;
			align-items: center;
			justify-content: center;
			text {
				font-size: 1rem;
				color: #fba18c;
			}
		}
}
.user-cut {
	margin-top: 80upx;
	padding-bottom: 120upx;
	&-vip {
		text-align: center;
		image {
			width: 710upx;
			height: 150upx;
		}
	}
	&-box1 {
		margin: 20upx auto;
		width: 710upx;
		background-color: #fff;
		border-radius: 20upx;
		&-top {
			padding-top: 30upx;
			text {
				font-size: 28upx;
				color: #333;
				margin-left: 20upx;
			}
		}
		&-bottom {
			.cut-list {
				margin-top: 40upx;
				display: flex;
				flex-wrap: wrap;
				&-item {
					width: 25%;
					margin-bottom: 40upx;
					display: flex;
					flex-direction: column;
					align-items: center;
					image {
						width: 50upx;
						height: 50upx;
					}
					text {
						font-size: 28upx;
						color: #333;
						margin-top: 20upx;
					}
				}
			}
		}
	}
}
	.logo {
		display: flex;
		align-items: center;
		justify-content: center;
		image {
			width: 230upx;
			height: 145upx;
		}
	}
	.maxWidth{flex:1;}
	
</style>
